<template>
  <div class="app-container" v-loading.fullscreen.lock="loading">
    <div class="filter-container">
      
    </div>
    <el-table border stripe highlight-current-row style="width: 100%;" :data="listData" :empty-text="emptyText">
      <el-table-column label="反馈用户">
        <template slot-scope="scope">
          {{scope.row.userName}} {{scope.row.userPhone}}
        </template>
      </el-table-column>
      <el-table-column label="反馈内容" prop="feedbackContent"></el-table-column>
      <el-table-column label="创建时间" prop="feedbackCreated"></el-table-column>
    </el-table>
    <div class="pager">
      <el-pagination
        background
        :pager-count="pagerCount"
        :page-size="reqData.perPage"
        :current-page="reqData.curPage"
        layout="prev, pager, next"
        @current-change="pageChange"
        :total="total">
      </el-pagination>
    </div>
  </div>
</template>

<script>
  import { getList } from '@/api/feedback'
  import { errorMsg, successMsg } from '@/utils/my'

  export default {
    inject: ['reload'],
    data() {
      return {
        reqData: {
          curPage: 1,
          perPage: 20
        },
        pagerCount: 13,
        total: 0,
        listData: [],
        loading: true,
        delRows: [],
        delIds: '',
        emptyText: '暂无任何数据'
      }
    },

    created() {
      this.fetchData()
    },

    methods: {

      pageChange(p) {
        this.reqData.curPage = p
        this.fetchData()
      },

      fetchData() {
        let that = this
        that.loading = true
        getList(that.reqData).then(res => {
          that.loading = false
          that.total = res.data.total
          that.listData = res.data.list
        })
      }

    }
  }
</script>

<style>
  .filter-container {
    margin-bottom: 10px;
  }

  .pager {
    width: 100%;
    text-align: center;
    margin-top: 20px;
  }
</style>
